<template>
	<view class="content">
	<view class="maim">
			<vuenavgit :navigationMsg="navigationMsg"></vuenavgit>
			<view class="pdsf">
				点击图片传入身份证人像面
			</view>
			<view class="idcurd" @click="idcurdsz">
				<image style="width: 100%;height: 100%;" :src="images1" mode=""></image>
			</view>
			<view class="pdsf">
				点击图片传入身份证国徽面
			</view>
			<view class="idcurd" @click="idcurdsf">
				<image style="width: 100%;height: 100%;" :src="images2" mode=""></image>
			</view>
			<view class="pds">
				支持png、jpg格式，不超过2M.
			</view>
		</view>
		</view>
</template>

<script>
	import {
		upload_card
	} from "../../../api/api.js"
	import vuenavgit from "../../../common/navgats/navgats.vue"
	export default {
		data() {
			return {
				navigationMsg:{
					title:"身份证上传认证",
							
				},
				images1:"/static/3ef000158467064486c05eab3aedc8d.png",
				images2:"/static/bb51ebbdd63b98a468e1e98e254d9a8.png",
		
			}
		},
		components:{
			vuenavgit
		},
		methods: {
			chooseImage(type) {
			      uni.chooseImage({
			        count: 1,
			        sizeType: ['compressed'],
			        sourceType: ['album', 'camera'],
			        success: (res) => {
			          const tempFilePath = res.tempFilePaths[0];
			          const file = res.tempFiles[0];
			          
			          if (type === 1) {
			            this.frontImage = tempFilePath;
			            this.frontFile = file;
			          } else {
			            this.backImage = tempFilePath;
			            this.backFile = file;
			          }
			        }
			      });},
			idcurdsz(){
				const that = this;
				uni.chooseImage({
				    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
				    sourceType: ['album'], //从相册选择
				    success: (res)=>{
						console.log(res,"ressssss")
				        console.log(res.tempFilePaths,"本地路径")
						
						let blob = new Blob(res.tempFilePaths, { type:'image/png' }); 
						let url = URL.createObjectURL(blob); // 转化为路径
						       const str = url;
						
						that.updaty(2,res.tempFiles[0])
						
						for(let i=0; i<res.tempFilePaths.length;i++){  //多次调用上传接口，一张一张传
							that.images1=res.tempFilePaths[i]
							uni.showToast({
								title: '身份证人像面已上传成功,请等待审核',
								icon: 'none',
								duration: 2000
							})
						}
						}
						})
			},
			
			idcurdsf(){
				const that = this;
				uni.chooseImage({
				    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
				    sourceType: ['album'], //从相册选择
				    success: (res)=>{
				        console.log(res.tempFilePaths,"本地路径")
						
						let blob = new Blob(res.tempFilePaths, { type:'image/png' }); 
						let url = URL.createObjectURL(blob); // 转化为路径
						       const str = url;
						console.log(str,"str")
					
						
						for(let i=0; i<res.tempFilePaths.length;i++){  //多次调用上传接口，一张一张传
							that.images2=res.tempFilePaths[i]
							that.updaty(1,res.tempFiles[0])
							uni.showToast({
								title: '身份证国徽面已上传成功,请等待审核',
								icon: 'none',
								duration: 2000
							})
						}
						}
						})
			},
			
			async updaty(types,files){
				console.log("file:",files)
				let formData={
					type:types,
					topic:"idcard"
				}
				return new Promise((resolve, reject)=>{
					uni.uploadFile({
						url:"https://api.jingkakeji.com/api/user/upload_card",
						filePath:files.path,
						name: 'file',
						formData: formData,
						  header: {
						            'token':  uni.getStorageSync('token') ,// 如果有token验证
									Server:1
									},
									success:(res) =>{
										console.log(res,"ressssd")
									}
									
					})
				})
				
			}
		}
	}

</script>

<style lang="scss" scoped>
.content {
			width: 100vw;
			height: 100vh;
			/* position: absolute; */
			background-color: #F6F6F6;
			display: flex;
			flex-direction: column;
			align-items: center;
			overflow-y: auto;
		}
		.maim {
			width: 100%;
			display: flex;
			flex-direction: column;
			align-items: center;
		}
		.idcurd{
			width: 70%;
			height: 300rpx;
			
		}
		.pdsf{
			width: 70%;
			height: 50rpx;
			line-height: 50rpx;
			text-align: center;
			font-size: 30rpx;
			color: #9D9D9D;
			margin-top: 50rpx;
		}
		.pds{
			width: 70%;
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
			font-size: 30rpx;
			color: #9D9D9D;
		}
</style>
